.toggle_subject {
    background: #efefef;

    .top {
        width: 10rem;
        height: 4.497778rem;
        background: #fff;
        box-sizing: border-box;
        padding: .8rem .444444rem 0;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        margin-bottom: .266667rem;

        section {
            display: -webkit-flex;
            display: flex;
            -webkit-justify-content: space-between;
            justify-content: space-between;
            font-size: .32rem;
            font-weight: 500;

            span:nth-child(1){
                color: #666;
                a{
                    color: #426c81;
                    font-weight: bold;
                }
            }
            span:nth-child(2){
                color: #2e57ff;
            }
        }

        h3{
            font-size: .711111rem;
            font-weight: 700;
            color: #2e57ff;
            -webkit-flex: 1 1;
            flex: 1 1;
            display: -webkit-flex;
            display: flex;
            -webkit-align-items: center;
            align-items: center;
            -webkit-justify-content: center;
            justify-content: center;
        }
    }

    .bottom{
        padding: .808889rem .462222rem .177778rem;
        background: #fff;
        margin-bottom: 100px;

        h3{
            color: #666;
            font-size: .32rem;
            line-height: .266667rem;
            margin-bottom: .408889rem;
        }

        ul{
            li{
                width: 9.111111rem;
                height: 1.244444rem;
                background: #f0f0f0;
                border-radius: .622222rem;
                margin-bottom: .533333rem;
                text-align: center;
                line-height: 1.244444rem;

                a{
                    font-size: .426667rem;
                    font-weight: 500;
                    color: #333;
                }
            }
        }
    }
}